//its home's components  
import React from 'react'
import '../../css/Channel.css'
export default function Channel({ channel, props }) {
  function targetChannel(id) {
    console.log(id)
    props.history.push('/channel?id='+id)
  }
  return (
    <ul className='channelUl'>
      {
        channel.map(item => <li key={item.id} onClick={() => {
          targetChannel(item.id)
        }}>
          <img src={item.icon_url} alt={item.name} />
          <span>{item.name}</span>
        </li>)
      }
    </ul>
  )
}
